<template>
  <!-- 草稿箱 -->
  <el-dialog
    v-model="dialogVisible"
    title="草稿箱"
    width="60%"
    :before-close="handleClose"
  >
    <c-table-template :data="tableData" v-loading="loading">
      <el-table-column label="序号" type="index" align="center" width="60" />
      <el-table-column
        label="商品标题"
        prop="data.productTitle"
        align="left"
        min-width="250"
      />
      <el-table-column
        label="车辆信息"
        prop="productInfo"
        align="left"
        min-width="250"
      >
        <template #default="scope">
          <c-vehicle-select
            v-model="scope.row.data.carInfoId"
            placeholder="请选择车辆信息"
            size="large"
            type="Text"
            class="wh"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="库存(辆)"
        prop="data.stockAmount"
        align="center"
        width="150"
      />
      <el-table-column prop="time" label="创建时间" align="left" width="200" />
      <el-table-column label="操作" align="center" width="120">
        <template #default="scope">
          <el-button type="primary" link @click="handleDetails(scope.$index)"
            >详情</el-button
          >
          <el-button type="danger" link @click="handleDel(scope)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </c-table-template>
  </el-dialog>
</template>
<script setup>
import { ref, getCurrentInstance } from "vue";
import cFileUpload from "@/components/Upload/FileUpload.vue";
import { ElMessage,ElMessageBox } from "element-plus";
import { useRouter } from "vue-router";
const router = useRouter();
const { proxy } = getCurrentInstance();
const dialogVisible = ref(false);
const loading = ref(false);
const tableData = ref([]);
const handleDetails = (index) => {
  router.push({
    path: "/PublishGoods/Details",
    query: {
      index,
    },
  });
};
const handleDel = (item) => {
  ElMessageBox.confirm("是否确认此操作?", "提醒", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  }).then(async () => {
    loading.value = true;
    const url = "/draft/delete";
    const data = {
      business: 2,
      data: JSON.stringify(item.row),
      dataSub:item.$index
    };
    await proxy.$post({ url, data });
    ElMessage.success("操作成功");
    getDraft();
  });
};
const getDraft = async () => {
  loading.value = true;
  try {
    const res = await proxy.$post({
      url: "/draft/get",
      data: {
        business: 2,
      },
    });
    tableData.value = (res || []).map((x) => {
      const item = JSON.parse(x);
      item.data = JSON.parse(item.data);
      return item;
    });
    loading.value = false;
  } catch (error) {
    loading.value = false;
  }
};
const handleOpen = async (item) => {
  dialogVisible.value = true;
  getDraft();
};
const handleClose = () => {
  dialogVisible.value = false;
};
defineExpose({
  handleOpen,
});
</script>

